<template>
  <editionSwitch :edition = "isNewCardStyle">
    <template slot='old_edition'>
      <right>
        <template slot="card">
          <CardGroup ref="cardGr"></CardGroup>
        </template>
        <template slot="detail">
          <keep-alive>
            <router-view>
            </router-view>
          </keep-alive>
        </template>
      </right>
    </template>
    <template slot='new_edition'>
      <SideBarLayout>
        <template slot="sidebar">
          <CustomerSideBarLeft ref="customerLeft"></CustomerSideBarLeft>
        </template>
        <template slot="detail">
          <CustomerSideBarRight @routeChangeActiveName="routeChangeActiveName"></CustomerSideBarRight>
        </template>
      </SideBarLayout>
    </template>
  </editionSwitch>
</template>
<script>
  import editionSwitch from '@/components/public-modules/public-switch/index'
  import right from '@/components/ui-modules/right-layout/RightLayout'
  import CardGroup from './CustCardGroup.vue'
  import SideBarLayout from '@/components/ui-modules/right-layout/SideBarLayout'
  import CustomerSideBarRight from './CustomerSideBarRight.vue'
  import CustomerSideBarLeft from './CustomerSideBarLeft.vue'
  export default {
    name: 'Customer',
    data () {
      return {
      }
    },
    components: {
      right,
      CardGroup,
      SideBarLayout,
      CustomerSideBarRight,
      CustomerSideBarLeft,
      editionSwitch
    },
    computed: {
      isNewCardStyle () {
        return this.$store.state.isNewCardStyle.customer ? 'new' : 'old'
      }
    },
    methods: {
      routeChangeActiveName (data) {
        this.$nextTick(() => {
          console.log(data, 'data2222============')
          this.$refs.customerLeft.setDefaultName(data)
        })
      }
    },
    mounted () {
      let state = 'old'
      if (this.$store.state.session.user.viewSwitch) {
        state = this.$store.state.session.user.viewSwitch['customer'] ? this.$store.state.session.user.viewSwitch['customer'] : 'old'
      }
      let stateBoolean = state === 'new'
      this.$store.commit('IS_NEW_CARD_STYLE', {type: 'customer', data: stateBoolean})
    },
    beforeRouteLeave (to, from, next) {
      this.currentRoute = from.fullPath
      next()
    },
    beforeRouteEnter (to, from, next) {
      next(vm => {
        if (to.query.active) {
        } else if (to.query.custName) {
          // 从其他模块跳进来 比如工作台的联系计划 浏览器的联系计划提醒 commit提交是为了刷新右侧的数据
//          vm.$store.commit('customer/REFRESH_CUST_RIGHT', Math.random())
        } else if (vm.currentRoute) {
          // 如果是当前模块 push当前的路由 并且通过不同的activeName来commit Blank 现实空白页
          vm.$router.push({path: vm.currentRoute})
          if (vm.$refs.cardGr) { // 新视图没有cardGr
            vm.$refs.cardGr.routerEnter()
          }
        }
        if (!vm.currentRoute) {
          vm.$store.commit('BLANK', 'customer_my')
        }
      })
    }
  }
</script>

